<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
<c:import url="/includes/header.jsp"></c:import>
<c:import url="/includes/modal.jsp"></c:import>
<script src="${pageContext.request.contextPath}/js/lib/angular.min.js"></script>
</head>
<body>

	<div class="container" style="width: 70%" ng-app="ng-app" id="ng-app">
		<div class="row" ng-controller="ngcontroller">
			<table class="table table-bordered table-striped"
				style="text-align: left; margin-top: 20px">
				<tr>
					<td><div style="font-size: 18px" class="col-sm-9">
							<span>打印机设置</span>
						</div></td>
				</tr>
				<tr ng-repeat="(index,value) in data track by index">
					<td>

						<div class="col-sm-8">
							<p>
								<span ng-if="value.use==true" class="btn-info"
									style="color: #c0ccda">使用中</span> <span
									ng-if="value.use==false" style="color: #c0ccda">未使用</span> <span
									style="font-size: 18px; margin-left: 5px">{{value.name}}</span>
							</p>
							<p>
								<span style="color: #c0ccda">每次打印份数:</span><span>{{value.pageCount}}份</span><span
									style="color: #c0ccda; margin-left: 10px">纸张宽带:</span><span>{{value.spec}}mm</span>
							</p>
						</div>
						<div class="col-sm-4">
							<p class="pinter">

								<span ng-if="value.use"><input type="button"
									class="btn btn-default btn-danger" value="停止使用"
									data-type="pause" data-name="{{value.name}}"
									data-count="{{value.pageCount}}" data-spec="{{value.spec}}">
								</span> <span ng-if="value.use==false"><input type="button"
									class="btn btn-default" value="开始使用" data-type="use"
									data-name="{{value.name}}" data-count="{{value.pageCount}}"
									data-spec="{{value.spec}}"> </span> <input type="button"
									data-type="print" data-name="{{value.name}}"
									class="btn btn-default" value="打印测试页">
							</p>
						</div>


					</td>
				</tr>

			</table>
		</div>
		<div class="row">
			<table class="table table-bordered table-striped"
				style="text-align: left; margin-top: 20px">
				<tr>
					<td><div style="font-size: 18px" class="col-sm-2">
							<span>语音设置</span>
						</div>
						<div>
							<span class="alert alert-warning" style="padding: 5px;">*当次数为0时，表示语音提醒循环播放</span>
						</div></td>
				</tr>
				<tr>
					<td>
						<form
							action="${pageContext.request.contextPath}/admin/shop/audio/save.do"
							method="post" id="audio_btn_form">
							<hr>
							<c:forEach items="${list }" var="s">
								<p>
									<span>${s.title }</span><input type="text" name="${s.type }"
										data-seq=${s.seq }
										placeholder="输入次数"
										data-src="${s.src }" data-type="${s.type }" value="${s.count}">次
									<a class="btn btn-sm btn-default test">试听</a>
								</p>
							</c:forEach>
							<p>
								<a class="btn btn-default" id="audio_btn">保存</a>
							</p>
						</form>
					</td>
				</tr>
			</table>
		</div>
	</div>
</body>
</html>
<script type="text/javascript">
	var app = angular.module('ng-app', []);
	app.config(function($sceProvider) {
		$sceProvider.enabled(false);
	});
	var $scopeGlod;
	app.controller('ngcontroller', function($scope, $http) {
		$scopeGlod = $scope;
		var str = top.nativeGetPrinter();
		$scopeGlod.data = JSON.parse(str);
	});

	$(function() {
		$(".pinter").find("input[type=button]").click(function() {
			var type = $(this).attr("data-type");
			var name = $(this).attr("data-name");
			var count = $(this).attr("data-count");
			var spec = $(this).attr("data-spec");
			var seq = $(this).attr("data-seq");
			if (type == "print") {
				top.nativePrintTest(name);

			} else if (type == "use") {
				var data = {
					"name" : name,
					"pageCount" : count,
					"spec" : spec,
					"seq" : seq,
					"use" : true
				};
				var str = JSON.stringify(data);
				var b = top.nativeSetPrinter(str);
				if (b) {
					window.location.reload();
					top.nativeVaildPrinter();
				}

			} else if (type == "pause") {
				var data = {
					"name" : name,
					"pageCount" : count,
					"spec" : spec,
					"use" : false
				};
				var str = JSON.stringify(data);
				var b = top.nativeSetPrinter(str);
				if (b) {
					window.location.reload();
					top.nativeVaildPrinter();
				}
			}
		});
	})

	$(function() {
		$("#audio_btn")
				.click(
						function() {
							var array = new Array();
							$("#audio_btn_form").find("input").each(function() {
								var name = $(this).prev().text();
								var data_src = $(this).attr("data-src");
								var data_type = $(this).attr("data-type");
								var count = $(this).val();

								var data = {
									"title" : name,
									"type" : data_type,
									"src" : data_src,
									"count" : count
								};
								array.push(data);
							});
							var content = JSON.stringify(array);
							$
									.ajax({
										url : "${pageContext.request.contextPath}/admin/shop/audio/save.do",
										type : "post",
										dataType : "json",
										data : {
											"content" : content
										},
										async : true,
										success : function(data) {
											if (data.code == "0") {
												bootbox.alert("保存成功",
														function() {
															window.location
																	.reload();
														});

											} else {
												bootbox.alert("网络不稳定,添加失败");
											}
										},
										error : function() {
											bootbox.alert("网络不稳定,添加失败");
										}
									});
						});

		$(".test").click(function() {
			var type = $(this).prev().attr("data-type");
			var src = $(this).prev().attr("data-src");
			var count = $(this).prev().val();
			var msg = {
				"src" : src,
				"count" : count
			};
			top.audio_play(msg);
		})
	})
</script>